{% extends 'base.html' %}
{% load static %}
<html lang="en">
<head>
    <meta charset="UTF-8">
    {% block title %}
        <title>Book Manage System</title>
    {% endblock title %}
</head>
{% block custom_css %}
    <link rel="stylesheet" href="{% static 'css/book.css' %}">
{% endblock custom_css %}

{% block tips %}
    <h3>Welcome to BMS</h3>
{% endblock tips %}

{% block content %}
    <div class="col-md-12">
        <p class="">
            <a href="{% url 'book:book_add' %}">
                <button type="button" class="btn btn-primary">添加书籍</button>
            </a>
        </p>
        <p>
        <h3 class="text-center">图书列表</h3>
        </p>
        <table class="table table-bordered table-striped table-hover">
            <!-- On rows -->
            <thead>
            <tr>
                <td class="success">编号</td>
                <td class="info">书籍名称</td>
                <td class="success">作者</td>
                <td class="info">价格</td>
                <td class="success">出版日期</td>
                <td class="info">出版社</td>
                <td class="success">操作</td>
            </tr>
            </thead>
            <tbody>
            {% csrf_token %}
            {% for book in books %}
                <tr>
                    <td>{{ forloop.counter }}</td>
                    <td>{{ book.name }}</td>
                    <td>{% for author in book.author.all %}
                        {{ author }}
                        {% if not forloop.last %},
                        {% endif %}
                    {% endfor %}
                    </td>
                    <td>{{ book.price }}</td>
                    <td>{{ book.publish_date|date:"Y-m-d" }}</td>
                    <td>{{ book.press }}</td>
                    <td>
                        <button type="button" class="btn btn-warning"><a
                                href="{% url 'book:book_edit' book.id %}">编辑</a>
                        </button>
                        <button type="button" class="btn btn-danger btn-del" value="{{ book.id }}">删除
                        </button>
                    </td>
                </tr>
            {% endfor %}
            </tbody>
        </table>

    </div>

{% endblock content %}

{% block custom_js %}
    <script>
        $(".btn-danger").on("click", function () {
            var the = $(this);
            var deleteId = the.attr("value");

            swal({
                    title: "你确定要删除吗？",
                    text: "删除可就找不回来了哦！",
                    type: "warning",
                    showCancelButton: true,
                    confirmButtonClass: "btn-danger",
                    confirmButtonText: "删除",
                    cancelButtonText: "取消",
                    closeOnConfirm: false
                },
                function () {

                    $.ajax({
                        url: "/book_del/" + deleteId + '/',
                        type: "post",
                        data: {
                            "id": deleteId, 'csrfmiddlewaretoken': '{{ csrf_token }}',
                        },
                        success: function (data) {
                            if (data.status === 1) {
                                swal("删除成功!", "你可以准备跑路了！", "success");
                                the.parent().parent().remove();
                            } else {
                                swal("删除失败", "你可以再尝试一下！", "error")
                            }
                        }
                    })
                });
        })
    </script>
{% endblock custom_js %}
</html>